<template>
  <div>
    <v-title title="我的邀请链接"/>
    <p class="dfr">
      <el-input v-model="url"></el-input>
      <el-button type="primary"  :data-clipboard-text="url" class="btn" @click="copy">复制链接</el-button>
    </p>
  </div>
</template>

<script lang="ts">
  import { Component, Vue } from 'vue-property-decorator'
  import vTitle from '../home-title'
  import Clipboard from 'clipboard'

  @Component({
    components: {
      vTitle
    }
  })
  export default class Invite extends Vue {
    url = ''
    async getInviteCode () {
      let res: AjaxResponse = await this.$axios.get('b/boms/invitationcode/generate')
      this.url = res.data.shortUrl
    }

    copy () {
      let c =  new Clipboard('.btn')
      c.on('success',_=>{
        this.$notify({
          title: '成功',
          message: '复制成功',
          type: 'success'
        });
      })
    }
    mounted () {
      this.getInviteCode()
    }
  }
</script>

<style scoped lang="less">
  .el-button {
    margin: 0 20px;
  }
</style>
